<template>
	<view class="container">
		<image class="page" :src="pageUrl" mode="widthFix"></image>
		<view class="fixBox">
			<text class="btn" @click="goNext">立即报名</text>
			<view class="checkout">
				<checkbox-group @change="bindChange" >
				<label>
					<checkbox style="transform:scale(0.5)" checked :value="check" /><text>已阅读并同意</text><text style="color:#209cf3;" @tap="agreement">《用户协议》</text>
				</label>
				</checkbox-group>
			</view>
		</view>
	</view>
</template>

<script>
	import {activityList} from '@/utils/interface.js'
	export default{
		data(){
			return {
				pageUrl:"",
				activityId:"",
				check:"1",
				len:1
			}
		},
		methods:{
			goNext(){
				if(this.len!=1){
					uni.showModal({
						title:'提示',
						content:"清勾选用户协议",
						showCancel:false
					})
					return false
				}
				uni.navigateTo({
					url:'/pages/sign/sign?id='+this.activityId
				})
			},
			// 获取活动广告
			activityList(id){
				activityList({method:"activities.advert",id}).then(res=>{
					
					if(res.status){
						this.pageUrl = res.data.img
					}else{
						uni.showModal({
							title:"提示",
							content:res.msg,
							showCancel:false,
							success(){
								uni.navigateBack()
							}
						})
					}
				})
			},
			agreement(){
				uni.navigateTo({
					url:"/pages/sign/agreement"
				})
			},
			bindChange(e){
				console.log(e.detail.value)
				this.len = e.detail.value.length
			}
		},
		onLoad:function(options){
			console.log(options)
			this.activityId = options.id
			this.activityList(options.id)
		}
	}
</script>

<style>
	.page{
		width: 100%;
		height: 100vh;
		display: block;
		object-fit: cover;
	}
	.container{
		position: relative;
	}
	.fixBox{
		position: fixed;
		width: 80%;
		left: 10%;
		bottom: 30upx;
	}
	.checkout{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.checkout text{
		font-size: 26upx;
		color: #555;
	}
	.btn{
		display: block;
		background: #ec3f1c;
		width: 100%;
		height: 80upx;
		border-radius: 50upx;
		color: #fff;
		text-align: center;
		line-height: 80upx;
		font-size: 36upx;
		font-weight: bold;
	}
</style>
